import QtQuick 2.14
import QtQuick.Controls 2.14
import QtQuick.Layouts 1.14

Rectangle {
    id: navigationButton
    
    property string text: ""
    property string icon: ""
    property bool isSelected: false
    signal clicked()
    
    height: 45
    color: isSelected ? "#37474F" : (mouseArea.containsMouse ? "#2E3B42" : "transparent")
    radius: 4
    
    RowLayout {
        anchors.fill: parent
        anchors.margins: 10
        spacing: 10
        
        Text {
            text: navigationButton.icon
            font.pixelSize: 16
            color: "white"
        }
        
        Text {
            Layout.fillWidth: true
            text: navigationButton.text
            font.pixelSize: 12
            color: navigationButton.isSelected ? "white" : "#B0BEC5"
            font.bold: navigationButton.isSelected
        }
    }
    
    MouseArea {
        id: mouseArea
        anchors.fill: parent
        hoverEnabled: true
        onClicked: navigationButton.clicked()
    }
}